import React, { Component } from 'react';
import { render } from 'react-dom';
import './base.css';
import { BrowserRouter, Route, Link } from 'react-router-dom';
import logo from './image/log.png';

//自定义组件
import Header from './components/headerWrapper/Header';
import Footer from './components/footerWapper/Footer';
import Bannaer from './components/banner/Banner';
import Model from './components/modalDialog/ModelDialog';
import ContentDetail from './components/contentDetail/ContentDetail';
import DoWhat from './components/doWhatWapper/DoWaht';
import HoToDo from './components/howToDoWrapper/HowToDo';
const getConfirmation = () => {
  // window.confirm('Are you sure?')
}


class Main extends Component {
  constructor(props) {
    super(props);
    this.state = { modelShow: false }
  }

  //点击显示二维码模态框
  _handleClick(e) {
    this.setState({
      modelShow: !this.state.modelShow
    })
  }


  render() {
    return (
      <BrowserRouter basename="/" forceRefresh={false} getUserConfirmation={getConfirmation()} keyLength={12} >
        <div className="content">
          <Model modelShow={this.state.modelShow} handleClick={this._handleClick.bind(this)} />
          <Header></Header>
          {/*<div style={{ height: '142px' }}></div>*/}
          <div className="bodyWapper">
            <Route exact path="/" component={Bannaer} />
            <Route exact path="/detail" component={ContentDetail} />
          </div>
          <div className="introWrapper">
           <a name="DoWhat"><DoWhat/></a> 
            <a name="HowToDo"><HoToDo/></a>
            {/*<DoWhat/>
            <HoToDo/>*/}
          </div>
          <Footer></Footer>
        </div>
      </BrowserRouter>
    )
  }
}

render(<Main />, document.getElementById('root'));
